$(document).ready(function() {  
	
	$('#addNote').on('click', function() {
		$('#noteDiv').slideToggle();
	});
	
	$('#saveNote').on('click', function() {
    	$.get("/RepairService/saveNote", "note=" + $('#noteArea').val(), function(result) {
    		if(result.trim() == "ok") {
    			var count = 0;
    			$('#tableOfEmployeeNotes').find('tr').each(function() {
    				count++;
    			});
    			$('#tableOfEmployeeNotes').append("<tr><td>" + count + "</td><td>" + $('#firstName').val() + "</td><td>" + $('#lastName').val() + "</td><td>" + $('#noteArea').val() + "</td><td><input type=\"button\" name=\"actionButton\" id=\"editNote\" value=\"Edit note\"/><input type=\"button\" name=\"saveChangesNote\" id=\"saveChangesNote\" value=\"Save changes\" style=\"display: none;\"/></td></tr>");
        		$('#noteDiv').slideToggle();
        		$('#addNote').remove();
        		$('#noteDiv').remove();
        		$('#saveNote').remove();
    			apprise('Note successfully added!!!');
    		} else {
    			apprise('Connection problem!!!<br>Please, try again!!!');
    		}

    	});
	});
	
	$('#saveChangesNote').hide();
	
	$('#listOfEmployeeNotes').on('click', '#editNote', function() {
		$(this).attr('disabled', 'disabled');
		$('#saveChangesNote').show();
		var $noteTd = $(this).parent().parent().find("td").eq(3);
		var text = $noteTd.text();
		$noteTd.html('<input type="text" id="noteInput" value="' + text +'"/>');
	});
	
	$('#listOfEmployeeNotes').on('click', '#saveChangesNote', function() {
		var $noteTd = $(this).parent().parent().find("td").eq(3);
		var text = $noteTd.find('input').val();
		$(this).hide();
		$('#editNote').removeAttr('disabled');
		$noteTd.html(text);
    	$.get("/RepairService/saveNote", "note=" + text, function(result) {
			if(result.trim() == "ok") {
				apprise('Note successfully edited!!!');
			} else {
				apprise('Connection problem!!!<br>Please, try again!!!');
			}
		});

	});	

});
